<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>组件示例</title>
    <link rel="stylesheet" type="text/css" href="../../font/iconfont.css">
    <link rel="stylesheet" type="text/css" href="../../css/reset.css">
    <link rel="stylesheet" type="text/css" href="../../css/common.css">
</head>
<body>
<!-----------按钮--------------->
<p>按钮，引用类名btn:</p>
    <input class="btn" id="pop" type="button" value="点击定制我的宴席" />

<!-----------背景按钮--------------->
<div class="text-btn">定制我的喜宴</div>

<!-----------左边带文字输入框------------->
<p>左边带有文字的输入框：</p>
<div class="text_put clearfix">
    <div class="kind fl">真实姓名</div>
    <input class="put fl" type="text"/>
</div>

<!-----------右下角主页icon------------->
<i class="iconfont icon-shouye nav-icon"></i>

<!-----------输入框------------------->
<p>输入框：</p>
<input class="put_wh" type="text">

<!-----------弹窗---------------->
<p>弹窗，使用方法：在需要用到的标签上添加 id="pop",请点击按钮查看效果</p>
    <div id="back">
        <div class="pop_box">
            <div class="pop_up">
                <p>定制专属囍宴</p>
                <p>邀请宾客入席</p>
                <p>抢999元现金贺礼</p>
                <button class="btn">查看活动规则</button>
                <span class="close iconfont icon-cancel"></span>
            </div>
        </div>
    </div>
<!-----------弹窗结束---------------->

<!-----------省份切换---------------->
<div id="cuted" class="clearfix">
    <i class="iconfont icon-shuaxin"></i>
    <span id="pro_gd">广东</span>
    <span id="pro_hn">海南</span>
</div>

<script src="../../js/jquery.js" type="text/javascript" charset="UTF-8"></script>
<script src="../../js/pop-up.js" type="text/javascript" charset="UTF-8"></script>
<script src="../../js/cuted_.js" type="text/javascript" charset="UTF-8"></script>
<script type="text/javascript">
    var $html=$('html');
    $html.css('font-size',$html.height()/504*16);
    $html.height($html.height());
</script>
</body>
</html>